@import "styles/common.scss";

.card1 {
	display: inline-block;
	// width: 220px;
	min-height: 250px;
	margin: 8px;
	border-radius: 6px;
	box-shadow: 0 4px 8px 0 rgba(0, 46, 68, 0.2), 0 6px 20px 0 rgba(0, 46, 68, 0.2);
	background: #ffffff;
	overflow: hidden;
	.header {
		padding: 20px 0;
		width: 100%;
		text-align: center;
		background-color: #fff;
		> img {
			// width: 30px;
			padding: 22px;
			width: 90px;
			border-radius: 100%;
			border: 10px solid $bgColor;
		}
	}
	.content {
		// background-color: $bgColor;
		padding: 5px 0;
		> p {
			margin-bottom: 8px;
			font-size: 12px;
			color: $wordColor;
		}
		> .description {
			font-size: 12px;
		}
		.item {
			padding: 2px;
			> span {
				&:first-child {
					display: inline-block;
					width: 60px;
					text-align: left;
					text-indent: 0.2rem;
				}
				&:nth-child(2) {
					display: inline-block;
					max-width: 135px;
				}
			}
		}
	}
}

.card2 {
	width: 400px;
	display: inline-block;
	margin: 8px;
	border-radius: 6px;
	box-shadow: 0 4px 8px 0 rgba(0, 46, 68, 0.2), 0 6px 20px 0 rgba(0, 46, 68, 0.2);
	background: #ffffff;
	overflow: hidden;
	.cardContent {
		display: flex;
		flex-direction: row;
	}
	.header {
		width: 200px;
		background-color: #fff;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		> img {
			padding: 22px;
			width: 90px;
			border-radius: 100%;
			border: 10px solid $bgColor;
		}
	}
	.content2 {
	}
	.content {
		// background-color: $bgColor;
		flex: 1;
		padding: 5px 0;
	}
	.item {
		padding: 5px 0;
		font-size: 12px;
		color: $wordColor;
		> span {
			&:first-child {
				display: inline-block;
				width: 60px;
				text-align: left;
				text-indent: 0.2rem;
			}
			&:nth-child(2) {
				display: inline-block;
				max-width: 135px;
			}
		}
	}
}
.img {
	// width: 30px;
	// height: 30px;
}

.blank {
	height: 148px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	background: #fff;
	font-size: 45px;
	color: gray;
}

.title {
	color: #009688;
	font-weight: bold;
	font-size: 18px;
	.urlStr {
		font-size: 12px;
		color: #cccccc;
		> a {
			color: inherit;
			font-size: inherit;
		}
	}
}
.description {
	> p {
		font-size: 12px;
		display: flex;
		flex-direction: row;
		> span:first-child {
			font-style: italic;
			color: #9e9e9e;
		}
		> span:last-child {
			font-weight: bold;
			color: #607d8b;
			flex: 1;
			text-overflow: ellipsis;
			overflow: hidden;
			white-space: nowrap;
		}
		// &:last-child {
		// 	height: 54px;
		// 	overflow: hidden;
		// }
	}
}
